{% extends "tj3/tj3.html" %}

{% block navigation %}
<script type="text/javascript">
	$(document).ready(function() {
		$('#advanced_option').hide();
		
		$('#show_advanced_option').click(function() {
			$('#advanced_option').toggle();
		});
		
		$('#id_taskperiod_set-0-start').datepicker();
		$('#id_taskperiod_set-0-end').datepicker();
		$('#id_taskperiod_set-0-max_start').datepicker();
		$('#id_taskperiod_set-0-min_start').datepicker();
		$('#id_taskperiod_set-0-max_end').datepicker();
		$('#id_taskperiod_set-0-min_end').datepicker();

	});
</script>	
{% endblock navigation %}

{% block content  %} 
<h1 class="ui-widget ui-widget-header">{{task.project.name}}/{{task.name}} <span class="float_right">Create a New Period</span></h1>

<div class="ui-widget ui-widget-content">	

	{% if duplicate_scenario %}
	<div class="ui-state-error mycontent fancy ui-corner-all">
	<span class="ui-icon ui-icon-alert" style="float: left; margin-right: .3em;"></span>
	Task periods for scenario "{{duplicate_scenario.name|capfirst}}" already exists! One scenario can have only one 
	such configuration defined!</div>
	{% endif %}
	
	<div class="mycontent">
	<form action="." method="post" enctype="multipart/form-data">
	{{ period_formset.management_form}}
		<div>
		{% for p in period_formset.forms %}
		<table>
			<tr><td>Scenario:<td>{{p.scenario}}<td>
			<tr><td>Start:<td>{{p.start}}
				<td><a href="http://www.taskjuggler.org/tj3/manual/start.html" title="help">
					<span class="ui-icon ui-icon-extlink" style="float: left; margin-right: .3em;"></span>
					</a>
					
			<tr><td>End:<td>{{p.end}}
				<td><a href="http://www.taskjuggler.org/tj3/manual/end.html" title="help">
					<span class="ui-icon ui-icon-extlink" style="float: left; margin-right: .3em;"></span>
					</a>
			<tr><td>Duration:<td>{{p.duration}}
				<td><a href="http://www.taskjuggler.org/tj3/manual/duration.html" title="help">
					<span class="ui-icon ui-icon-extlink" style="float: left; margin-right: .3em;"></span>
					</a>
			<tr><td>Length:<td>{{p.length}}
				<td><a href="http://www.taskjuggler.org/tj3/manual/length.html" title="help">
					<span class="ui-icon ui-icon-extlink" style="float: left; margin-right: .3em;"></span>
					</a>
			<tr><td>Effort:<td>{{p.effort}}
				<td><a href="http://www.taskjuggler.org/tj3/manual/effort.html" title="help">
					<span class="ui-icon ui-icon-extlink" style="float: left; margin-right: .3em;"></span>
					</a>
		</table>

		<a href="#" id="show_advanced_option" class="fancy">Advanced options...</a>

		<div id="advanced_option" style="display:none;" >
		<table>
			<tr><td>Max Start:<td>{{p.max_start}}
				<td><a href="http://www.taskjuggler.org/tj3/manual/effort.html" title="help">
					<span class="ui-icon ui-icon-extlink" style="float: left; margin-right: .3em;"></span>
					</a>
			<tr><td>Min Start:<td>{{p.min_start}}
				<td><a href="http://www.taskjuggler.org/tj3/manual/effort.html" title="help">
					<span class="ui-icon ui-icon-extlink" style="float: left; margin-right: .3em;"></span>
					</a>
			<tr><td>Max End:<td>{{p.max_end}}
				<td><a href="http://www.taskjuggler.org/tj3/manual/effort.html" title="help">
					<span class="ui-icon ui-icon-extlink" style="float: left; margin-right: .3em;"></span>
					</a>
			<tr><td>Min End:<td>{{p.min_end}}
				<td><a href="http://www.taskjuggler.org/tj3/manual/effort.html" title="help">
					<span class="ui-icon ui-icon-extlink" style="float: left; margin-right: .3em;"></span>
					</a>
			<tr><td>Complete:<td>{{p.complete}}
				<td><a href="http://www.taskjuggler.org/tj3/manual/complete.html" title="help">
					<span class="ui-icon ui-icon-extlink" style="float: left; margin-right: .3em;"></span>
					</a>
			</table>
		</div>		
		{% endfor %}
		</div>

		<div class="float_right">
			<input type="submit" name="command" value="Create" class="button" />
			<input type="submit" name="command" value="Cancel" class="button" />
		</div>
	</form>
	</div>
	
	<div class="mycontent">
		<h1 class="ui-state-highlight">Existing Periods</h1>
			<div>
			<table>
				<tr><td>
					{% for p in periods %}<td><a href={% url period_edit p.id,0 %}>{{p.scenario|capfirst}}</a>{%endfor%}
				<tr><td>Start Date:
					{% for p in periods %}<td>{{p.start}}{%endfor%}
				<tr><td>End Date:
					{% for p in periods %}<td>{{p.end}}{%endfor%}
				<tr><td>Duration:
					{% for p in periods %}<td>{{p.duration}}{%endfor%}
				<tr><td>Length:
					{% for p in periods %}<td>{{p.length}}{%endfor%}
				<tr><td>Effort:
					{% for p in periods %}<td>{{p.effort}}{%endfor%}
				<tr><td>Min Start:
					{% for p in periods %}<td>{{p.min_start}}{%endfor%}
				<tr><td>Max Start:
					{% for p in periods %}<td>{{p.max_start}}{%endfor%}
				<tr><td>Min End:
					{% for p in periods %}<td>{{p.min_end}}{%endfor%}
				<tr><td>Max End:
					{% for p in periods %}<td>{{p.max_end}}{%endfor%}
			</table>
			</div>
	</div>	
	
</div>


{% endblock content %}
